<template>
	<div class="main">
		<div class="main-header" v-if="buttons.length" style="display: flex;flex-wrap: wrap; line-height: 40px;">

				<el-input placeholder="请输入商品名称或编码或商户" style="width: 200px;margin-right: 10px;"
					v-model="searchParamCp.keyword" size="mini" clearable>
				</el-input>
				<el-select v-model="searchParamCp.check_status" size="mini" placeholder="请先选择审核状态"
					style="width: 200px;margin:0 10px;">
					<el-option v-for="(item, index) in catelist" :key="index" :label="item" :value="index">
					</el-option>
				</el-select>
				<el-select v-model="searchParamCp.status" size="mini" placeholder="请先选择上架状态"
					style="width: 200px;margin:0 10px;">
					<el-option v-for="(item, index) in onlist" :key="item.id" :label="item.title" :value="item.id">
					</el-option>
				</el-select>
				<!-- <div style="display: flex;align-items: center;">
					<el-radio v-model="type" :disabled="$store.state.type !== 0 ? true : false" :label="1"
						@input="getcate">供应商</el-radio>
					<el-radio v-model="type" :disabled="$store.state.type !== 0 ? true : false" :label="2"
						@input="getcate">商家</el-radio>
				</div>
				<el-cascader v-model="searchParamCp.cate_id" :options="catelist" placeholder="请先选择身份"
					:disabled="type !== 0 ? false : true" style="width: 200px;margin:0 10px;" :props="props"></el-cascader> -->
				<!-- <el-select v-model="searchParamCp.cate_id" size="mini" placeholder="请先选择身份" :disabled="type!==0?false:true"
					style="width: 200px;margin:0 10px;">
					<el-option v-for="item in catelist" :key="item.id" :label="item.name" :value="item.id">
					</el-option>
				</el-select> -->
				<div style="display: flex;align-items: center;margin-right: 10px;">
					<el-checkbox v-model="searchParamCp.goods_stuff" @change="getgoods(1)">是否推荐好货</el-checkbox>
					<!-- <el-radio v-model="searchParamCp.goods_stuff" @input="getgoods(1)">是否推荐好货</el-radio> -->
				</div>
				<div style="display: flex;align-items: center;margin-right: 10px;">
					<el-checkbox v-model="searchParamCp.is_recommend" @change="getgoods(2)">是否推荐</el-checkbox>
					<!-- <el-radio v-model="searchParamCp.is_recommend" @input="getgoods(2)">是否推荐</el-radio> -->
				</div>
				<el-button type="primary" size="mini" @click="searchs()">搜索</el-button>
				<el-button size="mini" style="margin-left: 30px;" @click="reset()">重置</el-button>
			<!-- <div style="display: flex;"> -->
				<elUploadFile style="margin-right: 10px;" v-if="info.id !== 1" :title="'导入'" :auto-upload="false"
					:upload-clear="true" :show-file-list="false" @change="upload" :limit="1" :multiple="false"
					accept=".xls,.xlsx" class="ml-10">
					<el-button type="primary">导入</el-button>
				</elUploadFile>
				<!-- <el-button size="mini" @click="upload()">导入</el-button> -->
				<el-button size="mini" type="primary" v-if="info.id !== 1" @click="onAdd()">添加</el-button>
				<el-button size="mini" type="primary" v-if="info.id == 1" @click="onexamine()">批量审核</el-button>
				<el-button size="mini" v-for="(item, index) in buttons" :key="index" :type="item.path | formatType"
					:icon="item.icon" :disabled="item.path | formatDisabled(selection)" @click="tapButton(item)">{{
						item.title }}</el-button>
			<!-- </div> -->

		</div>
		<el-table ref="table" class="main-table" :data="goodsData" height="100%" border
			header-cell-class-name="main-table-header" @selection-change="onSelectionChange" @row-click="onRowClick">
			<el-table-column type="selection" width="39"> </el-table-column>
			<el-table-column label="所属商户" prop="store_name"></el-table-column>
			<el-table-column label="商品图片">
				<template slot-scope="{row}">
					<el-image style="width:60px;height:60px" :src="row.url" :preview-src-list="[row.url]">
					</el-image>
				</template>
			</el-table-column>
			<el-table-column label="商品属性" width="90">
				<template slot-scope="{row}">
					<el-tag v-if="row.is_recommend == 1" type="success">推荐商品</el-tag>
					<el-tag type="primary" v-if="row.goods_stuff == 1">好货商品</el-tag>
				</template>
			</el-table-column>
			<el-table-column align="center" label="商品名称" prop="goods_name" />
			<el-table-column align="center" label="商品分类" prop="cate_name" />
			<el-table-column align="center" label="售价" prop="goods_price_min" />
			<!-- <el-table-column align="center" label="划线价" prop="goods_price_min" /> -->
			<el-table-column align="center" label="原价" prop="line_price_max" />
			<el-table-column align="center" label="审核状态" prop="status">
				<template slot-scope="{ row }">
					<el-tag v-if="row.check_status == 0">待审核</el-tag>
					<el-tag v-if="row.check_status == 1" type="success">已通过</el-tag>
				</template>
			</el-table-column>
			<el-table-column align="center" label="启用状态" prop="status">
				<!-- status状态  10上架 20下架 -->
				<template slot-scope="{ row }">
					<!-- <el-switch v-model="row.status == 20 ? false : true" disabled>
					</el-switch> -->
					<el-switch v-model="row.status == 20 ? false : true" @change="(e)=>changestatus(e,row)"></el-switch>
					<!-- <el-switch v-model="row.status" active-value="10" inactive-value="20"></el-switch> -->
				</template>
			</el-table-column>
			<el-table-column align="center" label="操作" prop="status" v-if="info.id !== 1">
				<template slot-scope="{ row }">
					<el-button type="primary" @click="onEdit(row)">编辑</el-button>
				</template>
			</el-table-column>
			<!-- //is_seck 0否  1是 秒杀商品-->
			<el-table-column align="center" label="操作" prop="status" v-else >
				<template slot-scope="{ row }">
					<el-button type="primary" :disabled="row.is_seck" @click="setkill(row)">设为秒杀</el-button>
				</template>
			</el-table-column>
		</el-table>
		<el-pagination class="main-pagination" :current-page.sync="page" :page-size="limit" :total="total"
			@current-change="onCurrentChange" layout="total,jumper,prev,pager,next"></el-pagination>
		<el-dialog :visible.sync="dialogVisible" :title="dialogTitle" append-to-body width="800px" @close="onDialogClose">
			<component  :killlist="killlist" :id="goodsid" :is="dialogView" @update="getGoodsData" :selection="selection"></component>
		</el-dialog>
	</div>
</template>

<script>
import {
	get, post,
	del, imghttp
} from "@/assets/js/http.js";
import Search from "./search.vue";
import elUploadFile from '@/components/el-upload-file.vue';
// import Edit from "./edit.vue";

export default {
	name: "view-admin",
	data() {
		return {
			goodsData: [],
			selection: [],
			page: 1,
			limit: 20,
			total: 0,
			dialogVisible: false,
			dialogTitle: "",
			dialogView: "",
			searchParamCp: {
				is_recommend: '', //是否推荐 0否 1是
				goods_stuff: '', //是否推荐 0否 1是
			},
			catelist: ['待审', '通过'],//check_status审核状态0待审 1通过
			onlist: [{ id: 10, title: '上架' }, { id: 20, title: '下架' }],//10上架 20下架
			searchinfo: {
				keyword: '',
				check_status: '',
				status: '',
			},
			props: {
				label: "name",
				value: "id",
				children: "child",
				checkStrictly: true
			},
			type: '',
			info: {},//个人信息详情
			killlist:[],
			goodsid:'',
		};
	},
	computed: {
		buttons() {
			return this.$store.state.buttons;
		}
	},
	components: {
		Search,
		elUploadFile,
		kill: () => import("./kill.vue"),
	},
	mounted() {
		this.getGoodsData();
		this.getMenuData()
		this.type = this.$store.state.type
		console.log(this.$store.state.type, 'type', this.type)
		if (this.type !== 0) {
			// this.getcate()
		}
		// this.getcate()
	},
	methods: {
		async getMenuData() {
			const data = await post({
				url: "/admin/index/index",
				loading: true
			});
			this.info = data.adminInfo;
			console.log(this.info, this.info.id)
		},
		getgoods(n) {
			if (n == 1) {
				console.log(this.searchParamCp.goods_stuff, 'goods_stuff')
			} else {
				console.log(this.searchParamCp.is_recommend, 'is_recommend')
			}
		},
		async getcate() {
			console.log(this.$store.state.type, 'type', this.type)
			//this.$store.state.type 1供应商，2 商家

			if (this.$store.state.type == 2 || this.type == 2) {
				const data = await get({
					url: "/admin/shop.MerchGoodsCategory/index",
					loading: true,
					params: {
						page: 1,
						limit: 999
					}
				});
				this.catelist = data.list;
			}
			if (this.$store.state.type == 1 || this.type == 1) {
				const data = await get({
					url: "/admin/shop.GoodsCategory/index",
					loading: true,
					params: {
						page: 1,
						limit: 999
					}
				});
				this.catelist = data.list;
			}
			this.searchParamCp.cate_id = ""
			this.searchinfo = {
				cate_id: ''
			}
		},
		async getGoodsData() {
			const data = await get({
				url: "/admin/shop.goods/merchGoodsindex",
				loading: true,
				params: {
					limit: this.limit,
					page: this.page,
					...this.searchinfo,
				}
			});
			this.goodsData = data.list;
			this.total = data.total;
		},
		//重置
		reset() {
			this.searchParamCp = {
				is_recommend: '', //是否推荐 0否 1是
				goods_stuff: '', //是否推荐 0否 1是
			}
			this.searchinfo = {
				keyword: '',
				check_status: '',
				status: '',
				is_recommend: '', //是否推荐 0否 1是
				goods_stuff: '', //是否推荐 0否 1是
			},
				this.getGoodsData()
		},
		//搜索
		searchs() {
			this.page = 1
			this.searchinfo = {
				...this.searchinfo,
				...this.searchParamCp,
				...{
					goods_stuff:this.searchParamCp.goods_stuff==true?1:'',
					is_recommend:this.searchParamCp.is_recommend==true?1:'',
				}
			}
			this.getGoodsData() 
			
		},
		onCurrentChange(index) {
			this.page = index;
			this.getGoodsData();
		},
		onAdd() {
			this.$router.push("/business-goods/add?goods_type=2");
		},
		onEdit(row) {
			if(this.info.id==1){
				return
			}
			this.$router.push({
				path: "/business-goods/edit",
				query: {
					id: row.id,
					goods_type: 2
				}
			});
			// this.$router.push("/goods/edit")
			// this.dialogTitle = "编辑商品";
			// this.dialogView = "Edit";
			// this.dialogVisible = true;
		},
		//秒杀
		setkill(row){
			if(this.info.id!==1){
				return
			}
			this.dialogTitle = "设置秒杀商品";
			this.dialogView = "kill";
			this.dialogVisible = true;
			get({
				url:'/admin/shop.goods/getSkuByGoodsId',
				params:{
					id:row.id
				}
			}).then(res=>{
				this.killlist = res.list
				console.log(res,'data')
				this.goodsid = row.id
			})
		},
		onSearch() {
			this.dialogTitle = "搜索商品";
			this.dialogView = "Search";
			this.dialogVisible = true;
		},
		onDelete() {
			this.$confirm(
				`此操作将永久删除该${this.selection.length}个商品, 是否继续?`,
				"提示", {
				confirmButtonText: "确定",
				cancelButtonText: "取消",
				type: "warning"
			}
			)
				.then(async () => {
					let query = "?";
					for (let i = 0; i < this.selection.length; i++) {
						const item = this.selection[i];
						if (i > 0) {
							query += "&ids[]=" + item.id;
						} else {
							query += "ids[]=" + item.id;
						}
					}
					await del({
						url: "/admin/shop.goods/del" + query,
						successTip: true,
						loading: true
					});
					this.getGoodsData();
				})
				.catch(() => {
					this.$refs.table.clearSelection();
				});
		},
		onSelectionChange(selection) {
			this.selection = selection;
		},
		onRowClick(row,column) {
			// console.log(row,'row', column)
			if(column.label=='启用状态'){
				
			}else{
				this.$refs.table.toggleRowSelection(row);
			}
		},
		onDialogClose() {
			this.$refs.table.clearSelection();
		},
		//设置有好货商品
		setPrimary() {
			this.$confirm(
				`此操作将设置${this.selection.length}个商品为好货商品, 是否继续?`,
				"提示", {
				confirmButtonText: "确定",
				cancelButtonText: "取消",
			}
			)
				.then(async () => {
					console.log('set')
					try {
						this.$loading()
						await post({
							url: "/admin/shop.goods/setStuff",
							successTip: true,
							loading: true,
							data: {
								ids: this.selection.map(item => item.id)
							}
						});
						this.getGoodsData();
					} catch (err) {
						console.log(err)
					} finally {
						this.$loading().close()
					}
				})
				.catch(() => {
					this.$refs.table.clearSelection();
				});
		},
		//取消有好货商品
		canlegoods(){
			this.$confirm(
				`此操作将取消${this.selection.length}个商品为好货商品, 是否继续?`,
				"提示", {
				confirmButtonText: "确定",
				cancelButtonText: "取消",
			}
			)
				.then(async () => {
					console.log('set')
					try {
						this.$loading()
						await post({
							url: "/admin/shop.goods/setStuff",
							successTip: true,
							loading: true,
							data: {
								ids: this.selection.map(item => item.id),
								type:1,
							}
						});
						this.getGoodsData();
					} catch (err) {
						console.log(err)
					} finally {
						this.$loading().close()
					}
				})
				.catch(() => {
					this.$refs.table.clearSelection();
				});
		},
		async changestatus(e,row){
			console.log(e,row)
			//status状态  10上架 20下架
			if(row.status==10){
				let ids = [];
				ids.push(row.id)
				console.log(ids,'ids')
				await post({
					url: "/admin/shop.goods/setGoodsStatus",
					data:{
						ids:ids,
						type:1,//下架传1
					},
					successTip: true,
					loading: true
				});
				this.getGoodsData();
			}else{
				let ids = [];
				ids.push(row.id)
				console.log(ids,'ids')
				await post({
					url: "/admin/shop.goods/setGoodsStatus",
					data:{
						ids:ids,
					},
					successTip: true,
					loading: true
				});
				this.getGoodsData();
			}
		},
		//批量下架商品、
		offgoods(){
			if(this.selection.length==0){
				this.$message('请先选择商品')
				return
			}
			this.$confirm(
				`此操作将下架该${this.selection.length}个商品, 是否继续?`,
				"提示", {
				confirmButtonText: "确定",
				cancelButtonText: "取消",
				type: "warning"
			}
			)
				.then(async () => {
					let ids = [];
					this.selection.forEach(item=>{
						ids.push(item.id)
					})
					console.log(ids,'ids')
					await post({
						url: "/admin/shop.goods/setGoodsStatus",
						data:{
							ids:ids,
							type:1,//下架传1
						},
						successTip: true,
						loading: true
					});
					this.getGoodsData();
				})
				.catch(() => {
					this.$refs.table.clearSelection();
				});
		},
		//批量上架商品、
		ongoods(){
			if(this.selection.length==0){
				this.$message('请先选择商品')
				return
			}
			this.$confirm(
				`此操作将上架该${this.selection.length}个商品, 是否继续?`,
				"提示", {
				confirmButtonText: "确定",
				cancelButtonText: "取消",
				type: "warning"
			}
			)
				.then(async () => {
					let ids = [];
					this.selection.forEach(item=>{
						ids.push(item.id)
					})
					console.log(ids,'ids')
					await post({
						url: "/admin/shop.goods/setGoodsStatus",
						data:{
							ids:ids,
							// type:1,//下架传1
						},
						successTip: true,
						loading: true
					});
					this.getGoodsData();
				})
				.catch(() => {
					this.$refs.table.clearSelection();
				});
		},
		tapButton(item) {
			if (item.path === "add") {
				this.onAdd();
			} else if (item.path === "edit") {
				this.onEdit();
			} else if (item.path === "delete") {
				this.onDelete();
			} else if (item.path === "search") {
				this.onSearch();
			} else if (item.path === "daoru") {
				this.upload();
			} else if (item.path === "set") {
				this.setrecommend();
			} else if (item.path == 'set-primary') {
				this.setPrimary()
			}else if (item.path == 'canlegoods') {
				this.canlegoods()
			}else if (item.path == 'canlerecommend') {
				this.canlerecommend()
			}else if (item.path === "ongoods") {
				this.ongoods();
			}else if (item.path === "offgoods") {
				this.offgoods();
			}
		},
		//设置商品为推荐商品
		setrecommend() {
			this.$confirm(
				`此操作将设置${this.selection.length}个商品推荐商品, 是否继续?`,
				"提示", {
				confirmButtonText: "确定",
				cancelButtonText: "取消",
				type: "warning"
			}
			)
				.then(async () => {
					await post({
						url: "/admin/shop.goods/setRecommend",
						loading: true,
						successTip: true,
						data: {
							id: this.selection.map(item => item.id)
						}
					});
					this.getMemberData();
				})
				.catch(() => {
					this.$refs.table.clearSelection();
					this.getGoodsData();
				});
		},
		//取消商品为推荐商品
		canlerecommend() {
			this.$confirm(
				`此操作将取消${this.selection.length}个商品推荐商品, 是否继续?`,
				"提示", {
				confirmButtonText: "确定",
				cancelButtonText: "取消",
				type: "warning"
			}
			)
				.then(async () => {
					await post({
						url: "/admin/shop.goods/setRecommend",
						loading: true,
						successTip: true,
						data: {
							id: this.selection.map(item => item.id),
							type:1
						}
					});
					this.getMemberData();
				})
				.catch(() => {
					this.$refs.table.clearSelection();
					this.getGoodsData();
				});
		},
		onexamine() {
			this.$confirm(
				`此操作将审核该${this.selection.length}个商品, 是否继续?`,
				"提示", {
				confirmButtonText: "确定",
				cancelButtonText: "取消",
				type: "warning"
			}
			)
				.then(async () => {
					let ids = [];
					this.selection.forEach(item => {
						ids.push(item.id)
					})
					await post({
						url: "/admin/shop.goods/checkGoods",
						data: {
							ids: ids
						},
						successTip: true,
						loading: true
					});
					this.getMemberData();
				})
				.catch(() => {
					this.$refs.table.clearSelection();
				});
		},
		//导入
		async upload({ raw }) {
			console.log(raw, 'raw')
			this.$loading({
				text: '导入中 请等待...'
			})
			await imghttp({
				url: '/admin/shop.Goods/import',
				data: {
					file: raw
				},
				successTip: true
			})
			this.getMemberData()
			this.$loading().close()
		},
	}
};
</script>
